<template>
	<view class="content padding">
		<view class="head bg-img"><text>{{smmUser.score!=null?smmUser.score:'重进以刷新'}}</text></view>
		<view class="cuIcon-title padding-tb"><text class="text-lg margin-left-xs ">积分流水</text></view>
		<view class="box shadow padding">
			<u-sticky>
				<view class="flex  text-bold justify-around  padding-tb-sm" style="background: #ffffff;">
					<text class="text-df t flex align-center justify-center" :class="[current == 1 ? 'selected' : '']" @click="click(1)">全部</text>
					<text class="text-df t flex align-center justify-center" :class="[current == 2 ? 'selected' : '']" @click="click(2)">流入</text>
					<text class="text-df t flex align-center justify-center" :class="[current == 3 ? 'selected' : '']" @click="click(3)">流出</text>
				</view>
			</u-sticky>
			<block v-for="(item, index) in scoreRecords" :key="index">
				<view v-show="current==1 || (item.isGet ==(3 - current))" class="flex flex-direction response padding-tb solid-bottom" style="color: #333333;">
					<view class="flex justify-between align-center">
						<text class="text-df">{{item.comment || ''}}</text>
						<view class="flex align-center">
							<text class="text-lg text-bold">{{item.isGet == 1 ? '+':'-'}}{{item.score || ''}}</text>
							<image class="margin-left-xs" src="../../static/personal/jinbi.png" style="width: 30rpx;height: 30rpx;" mode=""></image>
						</view>
					</view>
					<text style="color: #999999; " class="margin-top-xs text-xs">{{item.creationDate || ''}}</text>
				</view>
			</block>
		</view>
	</view>
</template>

<script>
	const app = getApp();
export default {
	data() {
		return {
			current: 1,
			smmUser:{},
			scoreRecords:[]
		};
	},
	onLoad(){
		console.log("app.globalData.smmUser: ",app.globalData.smmUser);
		this.smmUser = app.globalData.smmUser;
		app.globalData.api.getUserScore(app.globalData.smmUser.id).then(res=>{
			this.scoreRecords = res.resultObj;
		})
	},
	methods: {
		click(e) {
			this.current = e;
		},
	},
};
</script>

<style lang="scss" scoped>
.content {
	.head {
		width: 690rpx;
		height: 330rpx;

		border-radius: 20rpx;
		margin: 0 auto;
		background-image: url('https://sprtcar.oss-cn-chengdu.aliyuncs.com/home/ceM7n0.png');
		padding: 120rpx 0 0 60rpx;
		text {
			font-size: 80rpx;
			font-family: PingFang SC;
			font-weight: 800;
			color: #ffffff;
		}
	}
	.box {
		width: 690rpx;
		//height: 995rpx;
		background: #ffffff;
		border-radius: 20rpx;
		.selected {
			font-size: 35rpx;
			border-bottom: 4rpx solid #feba0e;
			transition: 1s font-size;
			//border-bottom-left-radius: 10rpx;
			//border-bottom-right-radius: 10rpx;
		}
		.t {
			display: block;
			display: flex;
			align-items: center;
			justify-content: center;
			width: 100rpx;
			height: 60rpx;
		}
	}
}
</style>
